$(function() {
    $("#map").show();
    $("#charts").hide();
    $("#sunny").hide();
    $("#knowledge").hide();
    weather();

    $("#nav1").click(function () {
        changeShow("map");
    });
    $("#nav2").click(function () {
        changeShow("charts");
    });
    $("#nav3").click(function () {
        changeShow("sunny");
    });
    $("#nav4").click(function () {
        changeShow("knowledge");
    });
});

function weather(){
    var appid = '46582196';
    var sec = '3Sf8qhkY';
    $('#weather1').leoweather({appid:appid,appsecret:sec,
        format: '<div class="top">' +
            '{年}年{月}月{日}日 {时}:{分}:{秒} 星期{周}' +
            '</div>' +
            '<div class="mid">' +
            '<div class="fl"><img src="./images/weather/{天气}.png" /></div>' +
            '<div class="fr"><h2>{城市} {天气}</h2><p>{最低气温}~{最高气温}</p><p>{风向}{风级}</p></div>' +
            '</div>'
    });
}

function changeShow(divId) {
    if(divId == "map"){
        $("#map").show();
        $("#charts").hide();
        $("#sunny").hide();
        $("#knowledge").hide();
    }else if(divId == "charts") {
        $("#map").hide();
        $("#charts").show();
        $("#sunny").hide();
        $("#knowledge").hide();
    }else if(divId == "sunny"){
        $("#map").hide();
        $("#charts").hide();
        $("#sunny").show();
        $("#knowledge").hide();
    }else if(divId == "knowledge") {
        $("#map").hide();
        $("#charts").hide();
        $("#sunny").hide();
        $("#knowledge").show();
    }
}